<template>
  <div class="boss">
    <head-page title="新产品" id="backstyle"></head-page>
    <Banner id="6" class="bannerId"></Banner>
    <div class="text title-center  l-h tac">
     {{ TopTitle }}({{ texttitle.slice(0,-2)}})
    </div>
    <div class="war" v-if="list.length">
      <div class="area-center">
        <div class="umit title-center">
          <div
            class="xiao flex aic m-t-07"
            v-for="(item, index) in list"
            :key="index"
            @click="appletpage(item, index + 1, texttitle, TopTitle)"
          >
            <div class="left">
              <div>{{ index + 1 }}.</div>
            </div>
            <div>
              {{ item.productName }}
            </div>
          </div>
        </div>
      </div>
    </div>
    <div class="tac c999 m-t-20" v-else>暂无数据</div>
  </div>
</template>

<script>
import { productName, selectTProductByName } from "@/api/index";
// selectTProductByName   已改
import Banner from "@/components/Home/BannerView.vue";
export default {
  data() {
    return {
      list: [],
      title: "",
      texttitle: this.$route.query.title,
      TopTitle: this.$route.query.top_title,
    };
  },
  components: {
    Banner,
  },
  mounted() {
    if (
      this.$route.query.title == "福建省产品" ||
      this.$route.query.title == "全国各省产品" ||
      this.$route.query.title == "海外产品"
    ) {
      //新产品
      productName({
        producttypeId: this.$route.query.id,
        productAddress: this.$route.query.citysub,
      }).then((res) => {
        if (res.data.code == 200) {
          this.list = res.data.data;
          // this.title = res.data.rows[0].producttypeId;
        }
      });
    } else {
      //重大产品
      selectTProductByName({
        producttypeId: this.$route.query.id,
      }).then((res) => {
        if (res.data.code == 200) {
          this.list = res.data.data;
          this.title = res.data.data[0].producttypeId;
        }
      });
    }
  },
  methods: {
    //跳转产品详情
    appletpage(item, i, texttitle, TopTitle) {
      this.$router.push({
        path: "/productdetails",
        query: {
          contect: item.productName,
          index: i,
          id: item.productId,
          texttitle,
          TopTitle,
        },
      });
    },
  },
};
</script>

<style scoped>
.boss {
  width: 100%;
  height: 100%;
}

.umit {
  width: 100%;
  min-height: 0.4rem;
}
.xiao {
  width: 100%;
  display: flex;
}
/* 左边区域 */
.xiao .left {
  width: 5%;
  height: 100%;
  margin-left: 0.1rem;
}
.xiao .left img {
  width: 0.17rem;
  height: 0.3rem;
}
/* 中间区域 */
.zhong {
  height: 100%;
  line-height: 0.3rem;
  padding-left: 0.05rem;
}
.text {
  width: 100%;
 
}
</style>